.box{
	width: 200px;
	height: 200px;
	border: 1px solid green;
	text-align: center;
	font-size: 40px;
	/* 浮动:让块级盒子水平摆放 */
	/* 浮动float:left(左浮动)/right(右浮动)/none(默认值不浮动) */
	float:right;
}
.box2
	width: 700px;
	height: 200px;
	border: 1px solid red;
}
/* 第一种清除浮动的方法: */
.clear{
	/* 清除两端浮动 */
	overflow: hidden;
}
/* 第二种清除浮动的方法 */
.bigbox{
	/* overflow: hidden; */
}
/* 第三种清除浮动的方法:给父级元素添加after伪类 */
.clearfix::after{/* 伪类:在clearfix类的后面 */
	content: "";/* 内容:空 */
	display: block;/* 将伪类转换为块元素 */
	height: 0;
	clear:both ;/* 清除两端浮动 */
	visibility: hidden;/* 显示状态:隐藏 */
}
/* 第四种清除方法:给父级元素添加双伪元素 */
.clear::before,.clearfix::after{
	content: "";
	display:table;
}
.clearfix::after{
	clear:both;
}

/* 
浮动的特性: 
1.浮动的盒子会脱离标准流(脱标）；
2.浮动的盒子——行内显示并且顶端对齐，一行装不下会另起一行
3.浮动的盒子具有和行内块元素类似的特性。
*/